@charset "utf-8";

.zs_bg {
  background: url("../image/zs_bg.jpg") left top no-repeat;
  background-size: 100vw 100vh;
}

.titleColor{
  color: transparent;
  background-image: linear-gradient(to bottom,#28d7e8 ,#028af0);
  -webkit-background-clip: text;
}
/************* header 部分 *************/
.zs_header {
  display: flex;
  width: 100%;
  height: 8.6vh;
  background: url("../image/top.png") left top no-repeat;
  background-size: 100vw 8.6vh;
}

.zs_header_left,
.zs_header_right {
  width: 31.8vw;
}

.zs_header_left {
  display: flex;
  height: 4.4vh;
  justify-content: flex-start;
  align-items: center;
  /* padding-left: 1vw; */
}


.zs_header_left .goBack {
  width: 15.6vw;
  height: 3.9vh;
  padding-left: 1.8vw;
  background: url("../image/zs/fanhui.png") left top no-repeat;
  background-size: 5.7vw 3.89vh;
  box-sizing: border-box;
  cursor: pointer;
}
.goBack2 {
    width: 11.6vw;
    height: 3.9vh;
    padding-left: 1.8vw;
    background: url("../image/zs/backChina.png") left top no-repeat;
    background-size: 5.7vw 3.89vh;
    box-sizing: border-box;
    cursor: pointer;
    margin-left: auto;
}
.reportTime {
    flex: 1;
    font-size: 1.6vh;
    color: rgba(255,255,255,0.7);
    font-weight: 600;
}

.reportTime .week {
  margin-right: 1vw;
}

.zs_header .zs_header_title {
  flex: 1;
  display: flex;
  height: 6.4vh;
  justify-content: center;
  align-items: center;
  font-size:3vh;
  font-weight: 600;
}

.zs_header .zs_header_title img {
  width: 23.4vw;
  height: 6.4vh;
}

/************* 主体部分 *************/

.zs_main {
  width: 100vw;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 1.8vw;
  box-sizing: border-box;
}

.zs_main_left {
  width: 23vw;
  height: 100%;  
  margin-bottom: -4vh;
}

.zs_main_left .leftBox {
  width: 100%;
  height: 32.3vh;
  padding: 1.3vh 0 0 0.7vw;
  margin-bottom: 1vh;
  background: url("../image/zs/xmztqk.png") left top no-repeat;
  background-size: 23vw 32.3vh;
}

.zs_main_left .leftBoxItemActive,
.zs_main_left .leftBoxwarnMes {
  height: 25.2vh;
  background-image: url(../image/zs/xmdt.png);
  background-size: 23vw 25.2vh;
}

.zs_main_left .leftBox .leftItemBox,
.zs_main_right .zs_right_item .freeBox {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}

.zs_main_left .leftBox .leftItemBox .leftItem,
.zs_main_right .zs_right_item .freeBox .leftItem{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 10.4vw;
  height: 9.1vh;
  padding-top: 1.25vh;
  background: url("../image/zs/xmztqk1.png") left top no-repeat;
  background-size: 10.4vw 9.1vh;
  box-sizing: border-box;
  margin-bottom: 1vh;
  margin-right: 0.7vw;  
}

.title {
  height: 4.2vh;
  padding-left: 0.5vw;
  line-height: 4.2vh;
  font-size: 2.2vh;
  color: transparent;
  font-weight: 600;
  background-image: linear-gradient(to top,#749bd4 ,#fff);
  /* background-clip:text; */
  -webkit-background-clip:text;
  margin-bottom: 1vh;
}

.leftBoxItemActive .title,
.leftBoxwarnMes .title,
.cenBot .title,
.zs_main_right .title {
  display: flex;
  justify-content: space-between;
  height: 3.3vh;
  line-height: 3.3vh;
  padding-right: 2.5vw;
  box-sizing: border-box;
}

.cenBot .title  {
  padding-left: 1.2vw;
}

.zs_main_right .title {
  margin-top: 1.1vh;
  padding-left: 0.8vw;
}

.leftBoxItemActive .title .detail {
  font-size: 1.5vh;
  cursor: pointer;
}

.name {
  height: 2.2vh;
  line-height: 2.2vh;
  color: #fff;
  text-align: center;
  font-size: 1.3vh;
  margin-bottom: 1vh;
}

.num {
  text-align: center;
  font-size: 2.4vh;
  font-family: "造字工房尚黑";
  font-weight: 600;
  color: transparent;
  background-image: linear-gradient(to right,#68ffad ,#8af7fe);
  /* background-clip:text; */
  -webkit-background-clip:text;
}

.leftBoxItemActive .leftBoxUiLi,
.leftBoxwarnMes .leftBoxwarnUiLi {
  width: 100%;
  padding: 0 1.1vw;
  margin-top: 1.2vh;
  box-sizing: border-box;
}

.leftBoxUiLi ul,
.leftBoxwarnUiLi ul {
  max-height: 14.9vh;
  overflow-y: scroll;
  overflow-x: hidden;
  scrollbar-width: thin;
}

 /*滚动条样式*/
 .leftBoxUiLi ul::-webkit-scrollbar, 
.leftBoxwarnUiLi ul::-webkit-scrollbar {
  width: 0.3vw;    
}

.leftBoxUiLi ul::-webkit-scrollbar-thumb,
.leftBoxwarnUiLi ul::-webkit-scrollbar-thumb {
    border-radius: 0.5vw;
    -webkit-box-shadow: inset 0 0 0.3vw #fff;
    background: rgba(0,0,0,0.2);
}

.leftBoxUiLi ul::-webkit-scrollbar-track,
.leftBoxwarnUiLi ul::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0.3vw #fff;
    border-radius: 0;
    background: rgba(0,0,0,0.5);
}

.leftBoxUiLi ul li {
  max-width: 18.4vw;
  padding-left: 1.5vw;
  line-height: 2.5vh;
  font-size: 1.3vh;
  color: #fff;
  background: url(../image/zs/active.png) left center no-repeat;
  background-size: 0.83vw 1.5vh;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.leftBoxwarnUiLi ul li {  
  max-width: 18.4vw;
  padding-left: 1.5vw;
  line-height: 2.5vh;
  font-size: 1.3vh;
  color: #fff;
  background: url(../image/zs/warn.png) left 0.4vh no-repeat;
  background-size: 0.83vw 1.5vh;
  margin-top: 0.1vh;
}

.leftBoxwarnUiLi ul li:first {
  margin-top: 0;
}

.leftBoxwarnUiLi ul li .warn_title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.leftBoxwarnUiLi ul li .warn_title .warnName {
  max-width: 15.6vw;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.leftBoxwarnUiLi ul li .warnContent{  
  max-width: 16.1vw;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.zs_main_center {
  width: 48.2vw;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  margin: 0 0.93vw;
}

.zs_main_center .query {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 3.9vh;
  margin-top: 1.3vh;
  position: relative;
  z-index: 2222222222;
}

.zs_main_center .query .inp {
  display: inline-block;
  width: 9.8vw;
  height: 3.9vh;
  padding: 0 0.5vw;
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.7vh;
  background-color: #386db9;
  box-sizing: border-box;
  margin-right: 0.26vw;
}

.zs_main_center .query input::-webkit-input-placeholder {
  color: rgba(255,255,255,0.7);
}
.zs_main_center .query input::-moz-input-placeholder {
  color: rgba(255,255,255,0.7);
}
.zs_main_center .query input::-ms-input-placeholder {
  color: rgba(255,255,255,0.7);
}

.zs_main_center .query .queryBtn {
  width: 5.8vw;
  height: 3.9vh;
  background: url('../image/zs/chaxun.png') center no-repeat;
  background-size: 5.8vw 3.9vh;
  cursor: pointer;
  margin-top: 0.4vh;
}

.zs_main_center .map {
  width: 54vw;
  height: 62vh;
  position: relative;
  top: -6vh;
}

.zs_main_center .cenBot {
  width: 48.2vw;
  height: 27.8vh;
  /* padding-top: 1vh; */
  background: url("../image/zs/gdwjftr.png") left top no-repeat;
  background-size: 48.2vw 27.8vh;
  margin-top: -6vh;
}

.zs_main_center .unit {
  width: 41.7vw;
  height: 22vh;
  box-sizing: border-box;
  /* padding: 1vw 0; */
  margin: 0 auto;
}

.mapMsg {
  width: 23.1vw;
  height: 12vh;
  display: flex;
  flex-direction: column;
  padding-left: 8.3vw;
  padding-top: 1.9vh;
  background: url("../image/zs/tc.png") left top no-repeat;
  background-size: 23.1vw 12vh;
  box-sizing: border-box;
}

.mapMsg span {
  font-size: 1.3vh;
  font-weight: 400;
  color: #ffffff;
}

.mapMsg span.count {
  display: flex;
  align-items: center;
  line-height: 2.8vh;
  margin-top: 1.1vh;
} 

.mapMsg span i {
  font-size: 2.6vh;
  font-weight: 600;
  background-image: linear-gradient(to right,#4ed6a8 ,#8afafe);
  -webkit-background-clip: text;
  color: transparent;
  text-align: center;
  font-family: "造字工房尚黑";
}


.zs_main_right {
  width: 23.8vw;
  height: 85.2vh;
  background: url("../image/zs/xmjffx.png") left top no-repeat;
  background-size: 23.8vw 85.2vh;
}

.zs_main_right .zs_right_list {
  padding-left: 0.3vw;
}

.zs_main_right .zs_right_item .subTitle {
  height: 2vh;
  padding-left: 1.4vw;
  font-size: 1.9vh;
  font-weight: 600;
  color: #fff;
  background: url(../image/zs/tb.png) left center no-repeat;
  background-size: 1vw 1.9vh;
  margin-bottom: 1.5vh;
}

.zs_main_right .freeStatis {
  margin: 3.5vh 0 2vh;
}

.zs_main_right .freeStatis .subTitle,
.zs_main_right .investment .subTitle {
  margin-bottom: 0;  
}

.zs_main_right .zs_right_item .freeChart,
.zs_main_right .zs_right_item .investmentChart {
  width: 23.8vw;
  height: 22.2vh;
}
